<template>
  <div class="app-container">
    <el-divider>常用功能</el-divider>
    <el-form ref="form" :model="formData" label-width="120px">
      <el-form-item label="开机自动启动">
        <el-switch v-model="formData.autoStart" @change="autoStart"></el-switch>
      </el-form-item>

      <!-- <el-form-item label="退款启用密码">
        <el-switch v-model="formData.refundPass"></el-switch>
      </el-form-item>

      <el-form-item label="支付金额保护">
        <el-switch v-model="formData.amountProtect"></el-switch>
      </el-form-item>

      <el-form-item label="悬浮窗提醒">
        <el-switch v-model="formData.suspend"></el-switch>
      </el-form-item> -->

      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
        <el-button @click="resetting">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script setup>
import { ref, onMounted } from "vue";
import { Message } from "element-ui";
const ipcRenderer = require('electron').ipcRenderer;

const form = ref();
const formData = ref({
  autoStart: false,
  refundPass: false,
  amountProtect: false,
  suspend: false,
});

onMounted(() => {
  //获取配置
  if (JSON.parse(localStorage.getItem("conventionSetup")) != null) {
    formData.value = JSON.parse(localStorage.getItem("conventionSetup"));
  }
});

//保存
const onSubmit = () => {
  localStorage.setItem("conventionSetup", JSON.stringify(formData.value));
  Message({
    message: "保存成功!",
    type: "success",
  });
  setTimeout(() => {
    location.reload();
  },500)
};

//开机启动
const autoStart = (val) => {
  // 给主进程发消息
  ipcRenderer.send('handle-checkbox', val)
}

//重置
const resetting = () => {
  formData.value = {
    autoStart: false,
    refundPass: false,
    amountProtect: false,
    suspend: false,
  }
  Message({
    message: "重置成功!",
    type: "success",
  });
};
</script>

<style scoped>
.line {
  text-align: center;
}
</style>

